<template>
  <div class="page-container-padding">
    <!-- 显示报告的表格 -->
    <div>
      <el-table border stripe :data="reportData">
        <el-table-column prop="file_date" label="日期"></el-table-column>
        <el-table-column prop="variety_name" label="品种"></el-table-column>
        <el-table-column prop="title" label="标题">
          <template #default="scope">
            <div
              style="cursor: pointer; color: #0189ff"
              @click="btnToViewer(scope.row)"
            >
              {{ scope.row.title }}
            </div>
          </template>
        </el-table-column>
        <el-table-column prop="examine_text" label="审核状态">
          <template #default="scope">
            <div :class="'examine' + scope.row.examine_state">
              {{ scope.row.examine_text }}
            </div>
          </template>
        </el-table-column>
        <el-table-column prop="examine_time" label="审核时间"></el-table-column>
      </el-table>
    </div>
    <div style="margin-top: 8px">
      <el-pagination
        background
        hide-on-single-page
        :current-page="page"
        :page-size="pageSize"
        layout="total, prev, pager, next, jumper"
        :total="totalCount"
        @current-change="currentPageChanged"
      ></el-pagination>
    </div>
  </div>
</template>
<script>
  import { datetimeToStr } from '@/utils/datetimeUtils'
  import { GetPeriodicReportFile } from '@/api/departmentWork/periodReport'
  export default {
    data() {
      return {
        reportDate: datetimeToStr(new Date(), true, ''),
        reportType: 'DAILY',
        page: 1,
        pageSize: 30,
        totalCount: 0,
        reportData: [],
      }
    },
    mounted() {
      this.queryMyReport()
    },
    methods: {
      queryMyReport() {
        GetPeriodicReportFile(
          this.reportType,
          this.page,
          this.pageSize,
          'own'
        ).then((res) => {
          const data = res.data
          this.reportData = data.data
          this.totalCount = data.total_count
        })
      },

      currentPageChanged(page) {
        this.page = page
        this.queryMyReport()
      },

      btnToViewer(item) {
        let a = document.createElement('a')
        a.href = item.pdf_file
        a.style.display = 'none'
        a.target = '_blank'
        document.body.appendChild(a)
        a.click()
        document.body.removeChild(a)
      },
    },
  }
</script>
<style scoped lang="scss">
  .examine1 {
    color: #1ed76d;
    font-weight: 700;
  }
  .examine-1 {
    color: #e61e1d;
    font-weight: 700;
  }
</style>
